<template>
<div>
  <div class="myheader">
    <div class="left" v-show="backDisplay" @click="goBack(path)"><img src="../../assets/left.png" alt=""></div>

    <slot name="title"><div></div></slot>

    <div class="right">
      <slot name="up"><div></div></slot>
    </div>
  </div>
  <div class="headh"></div>
</div>
</template>

<script>
export default {
  name: 'myheader',
  props:{
    backDisplay:Boolean,
    path: {
      type: String,
      default: "",
    },
  },
  data () {
    return {}
  },
  methods: {
    goBack(path){
      if(!path){
        window.history.back();
      }else{
        this.$router.push({ name:path })
      }
    }
  },

}
</script>

<style lang="less" scoped>
.headh{height: 44px;}
.myheader{
  height: 44px;
  width: 100%;
  line-height: 44px;
  background-color: #ff8333;
  font-size: 16px;
  color: #fff;
  text-align: center;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
  .left{
    width: 26px;
    height: 26px;
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    img{
      display: block;
      width: 100%;
    }
  }
  .right{
    position: absolute;
    top: 50%;
    right: 15px;
    height: 100%;
    transform: translateY(-50%);
  };
}
</style>
